<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/orderpage.css">
</head>

<body>
    <nav>
        <div class="nav-content">
            <div class="logo">
                <img src="./img/会员中心/images/logo-1_02.jpg" alt="">
            </div>
            <div class="n-m">
                <div class="n-m-1">legochina.cn</div>
                <div class="n-m-2">欢迎光临<span class="nav-span">乐购</span>，请&nbsp;登录\<span class="nav-span">注册</span>
                </div>
            </div>
        </div>
    </nav>
    <div class="top-2">
        <div class="top-btn">
            <div class="btn homepage-txt">首页</div>
            <div class="btn active">我的订单</div>
            <div class="btn">会员特权</div>
        </div>
        <div class="logo-2">乐我所乐，我的VIP！</div>
    </div>
    <div class="main">
        <div class="left">
            <div class="left-info">
                <img src="./img/会员中心/images/vip-info_03.jpg" alt="">
            </div>
            <div class="list">
                <div class="info-list-1"><img src="./img/会员中心/images/a-1_16.jpg" alt=""></div>
                <div class="info-list-1"><img src="./img/会员中心/images/a-2_18.jpg" alt=""></div>
                <div class="info-list-1"><img src="./img/会员中心/images/a-3_20.jpg" alt=""></div>
                <div class="info-list-1"><img src="./img/会员中心/images/a-4_22.jpg" alt=""></div>
            </div>
        </div>
        <div class="order-list">
            <div class="order-list-txt">
                订单列表
            </div>
            <div class="order-lists">
                <div class="list-1">待付款(<span class="num">2</span>)</div>
                <div class="list-1">待收货(<span class="num">0</span>)</div>
                <div class="list-1">待评价(<span class="num">1</span>)</div>
            </div>
        </div>
        <div class="all-order">
            <div class="a-o-txt">
                全部订单(6)
            </div>
            <div class="orderlist">
                <div class="order-item">

                </div>
                <div class="order-select">
                    <div class="o-s-box">
                        <input type="checkbox" id="#s-all">全选
                    </div>
                    <span class="goods">商品</span>
                    <span class="price">单价</span>
                    <span class="status">状态</span>
                </div>
            </div>
        </div>
        <div class="container">
            <div class="order-item-list">
                <div class="check-box"></div>
                <input type="checkbox" class="checkbox" data-price="40">
                <div class="goods-item-img"><img src="./img/会员中心/book.jpg" alt=""></div>
                <div class="goods-title-2">从你的全世界路过</div>
                <div class="goods-price">40</div>
                <div class="goods-status">待付款</div>
                <div class="appraise">评价</div>
                <div class="del">删除</div>
            </div>
            <div class="order-item-list">
                <div class="check-box"></div>
                <input type="checkbox" class="checkbox" data-price="40">
                <div class="goods-item-img"><img src="./img/会员中心/book.jpg" alt=""></div>
                <div class="goods-title-2">从你的全世界路过</div>
                <div class="goods-price">40</div>
                <div class="goods-status">待付款</div>
                <div class="appraise">评价</div>
                <div class="del">删除</div>
            </div>
            <div class="order-item-list">
                <input type="checkbox" class="checkbox" data-price="40" id="closed">
                <div class="goods-item-img"><img src="./img/会员中心/book.jpg" alt=""></div>
                <div class="goods-title-2">从你的全世界路过</div>
                <div class="goods-price">40</div>
                <div class="goods-status">交易成功</div>
                <div class="appraise-1">评价</div>
                <div class="del">删除</div>
            </div>
            <div class="order-item-list">
                <input type="checkbox" class="checkbox" data-price="40" id="closed">
                <div class="goods-item-img"><img src="./img/会员中心/book.jpg" alt=""></div>
                <div class="goods-title-2">从你的全世界路过</div>
                <div class="goods-price">40</div>
                <div class="goods-status-2">交易关闭</div>
                <div class="appraise">评价</div>
                <div class="del">删除</div>
            </div>
            <div class="order-item-list">

                <input type="checkbox" class="checkbox" data-price="40" id="closed">
                <div class="goods-item-img"><img src="./img/会员中心/book.jpg" alt=""></div>
                <div class="goods-title-2">从你的全世界路过</div>
                <div class="goods-price">40</div>
                <div class="goods-status-2">交易关闭</div>
                <div class="appraise">评价</div>
                <div class="del">删除</div>
            </div>
            <div class="order-item-list">
                <input type="checkbox" class="checkbox" data-price="40" id="closed">
                <div class="goods-item-img"><img src="./img/会员中心/book.jpg" alt=""></div>
                <div class="goods-title-2">从你的全世界路过</div>
                <div class="goods-price">40</div>
                <div class="goods-status-2">交易关闭</div>
                <div class="appraise">评价</div>
                <div class="del">删除</div>
            </div>

            <div class="totalprice">
                <input type="checkbox" class="checkbox" id="total-box">
                <div class="t-s-1">
                    <div class="txt">全选 </div>
                    <div class="del-goods-3">删除选中的商品</div>
                    <div class="on">已选择<div class="num-2">0</div>件商品</div>
                    <div class="total">总价<p class="to-price">0</p>
                    </div>
                </div>

                <div class="settlement" id="openModalBtn">
                    去结算
                </div>
            </div>
        </div>
    </div>

    <div id="modalContainer" class="modal-container">
        <div class="modal-content">
            <div class="top-3">
                <button id="closeModalBtn">
                    <p class="go">确认付款</p><img src="./img/会员中心/close.png" alt="">
                </button>

            </div>

            <div class="pay-txt"><img src="./img/会员中心/incon-pay.png" alt="">是否去付款中心付款?</div>
            <button class="cancel">取消</button>
            <button class="pay">去付款</button>
        </div>
    </div>
    <div id="modalContainer-1" class="modal-container-1">
        <div class="modal-content-1">
            <div class="top-3">
                <button id="closeModalBtn-1">
                    <p class="go">确认付款</p><img src="./img/会员中心/close.png" alt="">
                </button>

            </div>

            <div class="pay-txt"><img src="./img/会员中心/incon-pay.png" alt="">支付失败</div>

        </div>
    </div>

    <div class="footer">
        <div class="end81">
            <img src="./img/会员中心/footimg.png" alt="">
        </div>

        <div class="yellowline">

        </div>
        <div class="footersum">
            <div class="taglist">
                <div class="out">
                    <div class="tu">
                        <img src="./img/会员中心/正.png" alt="">
                    </div>
                    <div class="zi">
                        正规渠道正品保障
                    </div>
                </div>
                <div class="out">
                    <div class="tu">
                        <img src="./img/会员中心/羊.png" alt="">
                    </div>
                    <div class="zi">
                        放心购物
                        货到付款
                    </div>
                </div>
                <div class="out">
                    <div class="tu">
                        <img src="./img/会员中心/车.png" alt="">
                    </div>
                    <div class="zi">
                        625城市
                        次日到达
                    </div>
                </div>
                <div class="out">
                    <div class="tu">
                        <img src="./img/会员中心/收.png" alt="">
                    </div>
                    <div class="zi">
                        上门退货
                        当面退款
                    </div>
                </div>


            </div>
            <div class="textlist">
                <div class="item">
                    <div class="iitems">购物指南</div>
                    <div class="iitem">购物流程</div>
                    <div class="iitem"> 发票制度</div>
                    <div class="iitem">账户管理</div>
                    <div class="iitem">会员优惠</div>
                </div>
                <div class="item">
                    <div class="iitems">支付方式</div>
                    <div class="iitem">货到付款</div>
                    <div class="iitem"> 网上支付</div>
                    <div class="iitem">礼品卡支付</div>
                    <div class="iitem">银行转帐</div>
                </div>
                <div class="item">
                    <div class="iitems">订单服务</div>
                    <div class="iitem">订单配送查询</div>
                    <div class="iitem">
                        订单状态说明</div>
                    <div class="iitem">
                        自助取消订单</div>
                    <div class="iitem">
                        自助修改订单度</div>
                </div>
                <div class="item">
                    <div class="iitems">退换货</div>
                    <div class="iitem">退换货政策</div>
                    <div class="iitem"> 退换货申请补助</div>
                    <div class="iitem">退换货进度查询</div>
                    <div class="iitem">退货方式和时间</div>
                </div>
                <div class="item">
                    <div class="iitems">商家服务</div>
                    <div class="iitem">商家中心</div>
                    <div class="iitem">
                        运营服务</div>

                    <div class="iitem"> 加入尾品汇</div>

                </div>

            </div>
            <div class="investor-relations-blog">
                公司简介 | Investor Relations | 网站联盟 | 乐购招商 | 机构销售 | 手机乐购 | 官方Blog | 热词搜索
            </div>
            <div class="copyright-c-2004-2016-all-rights-reserved">
                Copyright (C) 乐购网 2004-2016, All Rights Reserved
            </div>



        </div>
    </div>
    <script src="./js/orderpage.js"></script>
</body>

</html>